/**
 * 图片查看器样式覆盖 - 最高优先级
 * 使用内联样式级别的优先级
 */

/* 创建一个高优先级的 CSS 层 */
@layer image-viewer-fix {
  /* 图片查看器包装器 - 使用所有可能的选择器组合 */
  body > div[class*="el-image-viewer__wrapper"],
  body div[class*="el-image-viewer__wrapper"],
  html body > .el-image-viewer__wrapper,
  html body .el-image-viewer__wrapper {
    z-index: 2147483647 !important; /* 使用 32 位整数最大值 */
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 遮罩层 */
  body > div[class*="el-image-viewer__mask"],
  body div[class*="el-image-viewer__mask"],
  html body > .el-image-viewer__mask,
  html body .el-image-viewer__mask {
    z-index: 2147483646 !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
  }

  /* Canvas 和图片 */
  .el-image-viewer__canvas,
  .el-image-viewer__img {
    z-index: 2147483647 !important;
  }

  /* 操作按钮 */
  .el-image-viewer__actions,
  .el-image-viewer__btn,
  .el-image-viewer__close {
    z-index: 2147483647 !important;
  }

  /* 强制降低其他元素的层级 */
  .el-table,
  .el-table *,
  .el-card,
  .el-card * {
    z-index: 1 !important;
  }
}

/* 不使用 @layer 的备用方案 */
body > div[class*="el-image-viewer__wrapper"][style*="z-index"] {
  z-index: 2147483647 !important;
}

body > div[class*="el-image-viewer__mask"][style*="z-index"] {
  z-index: 2147483646 !important;
}

